<%= content_for :title, t("scaffold.edit.title", model: "Cluster") %>

<%= cluster_layout(@cluster) do %>
  <div class="space-y-10">
    <div>
      <h2 class="text-2xl font-bold">General</h2>
      <hr class="mt-3 mb-4 border-t border-base-300" />
      <%= render "edit_form", cluster: @cluster %>
      
      <div class="mt-6" data-controller="content-toggle">
        <div class="flex items-center justify-between mb-4">
          <h2 class="text-2xl font-bold">Credentials</h2>

          <button type="button"
                  class="btn btn-sm btn-outline"
                  data-action="click->content-toggle#toggleEdit"
                  data-content-toggle-target="editButton">
            <iconify-icon icon="lucide:pen" height="16"></iconify-icon>
            Edit
          </button>
        </div>
        <hr class="mt-3 mb-4 border-t border-base-300" />

        <div data-content-toggle-target="placeholder" class="p-4 bg-base-200 rounded-lg">
          <p class="text-sm text-gray-500">Kubeconfig is hidden for security. Click edit to view and modify.</p>
        </div>

        <div data-content-toggle-target="editorContainer" class="hidden">
          <%= form_with(model: @cluster, url: cluster_path(@cluster), method: :patch) do |form| %>
            <%= form.hidden_field :kubeconfig_yaml_format, value: "true" %>
            <div class="form-group" data-controller="yaml-editor">
              <%= form.text_area(
                :kubeconfig,
                class: "code textarea textarea-bordered w-full",
                rows: 5,
                value: @cluster.kubeconfig.to_yaml,
                data: { 'yaml-editor-target': 'textarea' }
              ) %>
              <div data-yaml-editor-target="editor" class="mt-2"></div>
            </div>
            <div class="form-footer flex gap-2">
              <%= form.submit "Save", class: "btn btn-primary" %>
              <button type="button"
                      class="btn btn-outline"
                      data-action="click->content-toggle#cancelEdit">
                Cancel
              </button>
            </div>
          <% end %>
          <div class="text-sm text-gray-500 mt-2">
            Changes to the kubeconfig will update how Canine connects to your cluster.
          </div>
        </div>
      </div>
    </div>

    <% if Flipper.enabled?(:build_configuration, current_account) %>
      <%= render "clusters/build_clouds/section", cluster: @cluster %>
    <% end %>

    <div>
      <h2 class="text-2xl font-bold">Danger zone</h2>
      <hr class="mt-3 mb-4 border-t border-base-300" />
      <div class="mt-6">
        <%= render "clusters/transfer_ownership", cluster: @cluster %>
        <button class="btn btn-warning btn-outline mt-2 group" onclick="transfer_ownership_modal.showModal()">
          <iconify-icon icon="lucide:hand-helping" height="20" class="text-warning group-hover:text-black"></iconify-icon>
          Transfer Ownership
        </button>
      </div>

      <div class="mt-6">
        <%= button_to retry_install_cluster_path(@cluster), method: :post, class: "btn btn-warning btn-outline group mt-2", form: { data: { turbo_confirm: "Are you sure you want to rerun the installation?" } } do %>
          <iconify-icon icon="lucide:rotate-cw" height="20" class="text-warning group-hover:text-black"></iconify-icon>
          Rerun Installation
        <% end %>
        <div class="mt-2 text-sm text-gray-500">
          This will retry the cluster installation process, including reinstalling all cluster components.
        </div>
      </div>

      <div class="mt-6">
        <%= button_to @cluster, method: :delete, class: "btn btn-error btn-outline group mt-2", form: { data: { turbo_confirm: t("are_you_sure") } } do %>
          <iconify-icon icon="lucide:trash" height="20" class="text-error group-hover:text-error-content"></iconify-icon>
          Delete Cluster
        <% end %>
        <div class="mt-2 text-sm text-gray-500">
          This will delete all associated projects from Canine, and disconnect the cluster, but the underlying Kubernetes cluster will remain.
        </div>
      </div>
    </div>
  </div>
<% end %>
